<template>
  <div class="pages">
    <el-row type="flex" justify="end" >
          <div class="block">
            <el-pagination
              background
              layout="prev, pager, next,sizes,jumper"
              :current-page='page.page'
              :page-size='page.pagesize'
              :total='page.counts'
              :page-sizes="[5, 10, 20, 50]"
              @current-change="handleCurrentChange"
              @size-change="handleSizeChange"
              >
            </el-pagination>
          </div>
      </el-row>
  </div>
</template>

<script>
export default {
  name: 'PageTool',
  props: {
    page: {
      type: Object,
      required: true
    }
  },
  methods: {
    // 切换页数
    handleCurrentChange (currentPage) {
      this.$emit('handleCurrentChange', currentPage)
    },
    // 切换每页条数
    handleSizeChange (pagesize) {
      this.$emit('handleSizeChange', pagesize)
    }
  }
}
</script>

<style>
</style>
